<template>
  <div class="feedback">
    <div class="com-top-nav">
      <van-nav-bar
        title="意见反馈"
        left-arrow
        @click-left="onClickLeft"
      />
    </div>
    <div>
      <van-cell-group>
        <van-field
          type="textarea"
          v-model="formData.suggestion"
          required
          clearable
          :autosize="{maxHeight: '300', minHeight: '100'}"
          placeholder="告诉我们你所希望看到的改进，或是你所遇到的问题。"
        />
        <van-field
          label="联系方式"
          v-model="formData.connect"
          placeholder="手机/会员名/邮箱"
          required
        />
      <div class="button">
        <van-button size="large" @click="handleSubmit">提交认证</van-button>
      </div>
      </van-cell-group>
    </div>
  </div>
</template>
<script>
  import validator from '../../common/validatorFunction';

  export default {
    name: 'feedback',
    data(){
      return {
        isShowError: false,
        errorTips: '',
        formData: {
          suggestion: '',
          connect: '',
        },
        rules: {
          suggestion: [
            {require: true, message: '请输入建议或问题'}
          ],
          connect: [
            {require: true, message: '请输入联系方式'}
          ]
        }
      }
    },
    methods: {
      onClickLeft() {
        this.$router.go(-1);
      },
      handleSubmit() {
        // 保存数据
        const rulesResult = validator(this.formData, this.rules);
        console.log(rulesResult);
        if (rulesResult.result) {
          let params={
            uid:JSON.parse(sessionStorage.getItem('user')).uid,
              content:this.formData.suggestion,
              contactType:this.formData.connect
          }
          this.axios.get('/api/feedback',{params}).then(res=>{
            if(res.data.err_code ==0){
              this.$toast({message:res.data.data+'感谢您的反馈!', position: 'top'})
            }
          }).catch(e=>{
            console.log(e)

          })
        } else {
          const alertMessage = [];
          for (const key in rulesResult.detail) {
            if (!rulesResult.detail[key].isPass) {
              alertMessage.push(rulesResult.detail[key].message);
            }
          }
          this.isShowError = true;
          this.errorTips = alertMessage[0];
          this.$toast({message:this.errorTips, position: 'top'});
        }
      }
    }
  }
</script>

<style scoped lang="less" type="text/less">
  @import url('../../../static/style/var');

  .button {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 30px;
  }
</style>
